<template>
  <div>
    <NavHead>
      <template v-slot:iconfont-left>
        <i class="iconfont icon-arrowLeft arrow" @click="$router.back()"></i>
      </template>
      <template v-slot:title>
        <p class="confirm">订单确认</p>
      </template>
    </NavHead>
    <ShopTabs class="tabs-box" :titleData="titleData"> 
        <template v-slot:content1>
            <ShopTabs class="tabs-box1" :titleData="titleData1">
      <template v-slot:content1>
        <div class="product">
          <div class="pic">
            <img src="../../assets/image/01.jpg" alt="" />
            <p>买家已付款</p>
          </div>
          <div class="desc">
            <p>电脑桌</p>
            <p>简约又好看的桌子，嗯</p>
            <p>能读书，能吃饭，能打游戏</p>
            <p class="gold">¥ 1299</p>
            <p class="time">购买时间: 2020/12/12</p>
            <button>提醒发货</button>
          </div>
        </div>
      </template>
    </ShopTabs>
        </template>
    </ShopTabs>
     

  </div>
</template>

<script>
import NavHead from "../../components/NavHead";
import ShopTabs from "./shopTabs/ShopTabs";
export default {
  name: "OrderStore",
  components: {
    NavHead,
    ShopTabs,
  },
  data() {
    return {
      titleData: ["进行中", "已完成", "已关闭"],
      titleData1:['待发货','待付款','已发货','退款中']
    };
  },
};
</script>

<style>
.arrow {
  color: #fff;
  margin-top: 0.3rem;
}
.confirm {
  color: white;
  font-size: 0.38rem;
}
.product {
  background-color: white;
  height: 2.8rem;
  width: 95%;
  margin: 0.2rem auto;
  display: flex;
  box-sizing: border-box;
}
.tabs-box{
        margin-top:1.2rem;
    }
    .tabs-box1{
        margin-top: 0.2rem;
    }
.pic img {
  height: 2rem;
  width: 2.3rem;
  margin-top: 0.3rem;
  margin-left: 0.1rem;
  margin-bottom: 0.05rem;
  flex: 4;
}
.pic p {
  font-size: 0.2rem;
  text-align: left;
  margin-left: 0.1rem;
}
.desc {
  position: relative;
  margin-top: 0.3rem;
  flex: 6;
  position: relative;
}
.desc p {
  text-align: left;
  margin-left: 0.2rem;
  font-size: 0.24rem;
  line-height: 0.25rem;
}
.desc .gold {
  margin-top: 0.2rem;
  font-size: 0.22rem;
  color: red;
}
.desc .time {
  margin-top: 0.3rem;
}
.desc button {
  border: 2px solid black;
  border-radius: 3px;
  background-color: white;
  font-size: 0.2rem;
  width: 1.5rem;
  position: absolute;
  right: 0.2rem;
  bottom: 0.2rem;
}
</style>